import React from 'react'
import {Outlet,useNavigate} from 'react-router-dom'
import { homeRouter } from '../../router/Index'
import { Badge, TabBar } from 'antd-mobile'
import '../main/main.css'
function Index() {
    let Navigate=useNavigate()
  return (
    <div className='mainBox'>
    <main><Outlet></Outlet></main>
    <footer>
         <TabBar onChange={(key)=>Navigate(key)}>
          {homeRouter.map(item => (
            <TabBar.Item key={item.path} icon={item.icon} title={item.title} />
          ))}
        </TabBar>
    </footer>
    </div>
  )
}

export default Index
